import { __awaiter, __generator } from "tslib";
import equal from 'fast-deep-equal';
import { PickerDefaultProps } from './props';
import { getMatchedItemByValue, getMatchedItemByIndex, getStrictMatchedItemByValue, } from './utils';
import fmtEvent from '../_util/fmtEvent';
import mixinValue from '../mixins/value';
var component2 = my.canIUse('component2');
Component({
    props: PickerDefaultProps,
    data: {
        formatValue: '',
        columns: [],
        visible: false,
        selectedIndex: [],
    },
    mixins: [mixinValue()],
    tempSelectedIndex: null,
    single: false,
    isChangingPickerView: false,
    onInit: function () {
        this.initData();
    },
    didMount: function () {
        if (!component2) {
            this.initData();
        }
    },
    deriveDataFromProps: function (nextProps) {
        this.updateValue(this.props, nextProps);
    },
    didUpdate: function (prevProps) {
        if (!component2) {
            this.updateValue(prevProps, this.props);
        }
    },
    methods: {
        initData: function () {
            var _this = this;
            var columns = this.getterColumns(this.props.options);
            this.setData({
                columns: columns,
            }, function () {
                var formatValue = _this.getterFormatText();
                var selectedIndex = _this.getterSelectedIndex();
                _this.setData({
                    formatValue: formatValue,
                    selectedIndex: selectedIndex,
                });
            });
        },
        updateValue: function (prevProps, currentProps) {
            var _this = this;
            if (!equal(prevProps.options, currentProps.options)) {
                var newColums = this.getterColumns(currentProps.options);
                this.setData({
                    columns: newColums,
                }, function () {
                    // 如果是在滚动过程中columns发生变化，以onChange里抛出的selectedIndex为准
                    if (!_this.isChangingPickerView) {
                        _this.tempSelectedIndex = null;
                        var selectedIndex = _this.getterSelectedIndex();
                        _this.setData({
                            selectedIndex: selectedIndex,
                        });
                    }
                });
            }
            if (!equal(currentProps.value, prevProps.value)) {
                var selectedIndex = this.getterSelectedIndex();
                this.tempSelectedIndex = null;
                this.setData({
                    selectedIndex: selectedIndex,
                });
            }
            var formatValue = this.getterFormatText();
            if (formatValue !== this.data.formatValue) {
                this.setData({
                    formatValue: formatValue,
                });
            }
            this.isChangingPickerView = false;
        },
        getterColumns: function (options) {
            var columns = [];
            if (options.length > 0) {
                if (options.every(function (item) { return item instanceof Array; })) {
                    this.single = false;
                    columns = options.slice();
                }
                else {
                    this.single = true;
                    columns = [options];
                }
            }
            return columns;
        },
        defaultFormat: function (value, column) {
            if (column instanceof Array) {
                return column
                    .filter(function (c) { return c !== undefined; })
                    .map(function (c) {
                    if (typeof c === 'object') {
                        return c.label;
                    }
                    return c;
                })
                    .join('-');
            }
            return (column && column.label) || column || '';
        },
        getterFormatText: function () {
            var onFormat = this.props.onFormat;
            var columns = this.data.columns;
            var realValue = this.getValue();
            var matchedColumn = getStrictMatchedItemByValue(columns, realValue, this.single).matchedColumn;
            var formatValueByProps = onFormat && onFormat(realValue, matchedColumn);
            if (typeof formatValueByProps !== 'undefined') {
                return formatValueByProps;
            }
            return this.defaultFormat(realValue, matchedColumn);
        },
        getterSelectedIndex: function () {
            var selectedIndex = [];
            var columns = this.data.columns;
            var realValue = this.getValue();
            var value = realValue;
            if (this.single) {
                value = [realValue];
            }
            var _loop_1 = function (i) {
                var column = columns[i];
                var compareValue = value[i];
                if (compareValue === undefined || compareValue === null) {
                    selectedIndex[i] = 0;
                }
                var index = column.findIndex(function (c) {
                    return c === compareValue || c.value === compareValue;
                });
                if (index === -1) {
                    index = 0;
                }
                selectedIndex[i] = index;
            };
            for (var i = 0; i < columns.length; i++) {
                _loop_1(i);
            }
            return selectedIndex;
        },
        onOpen: function () {
            var disabled = this.props.disabled;
            if (!disabled) {
                this.tempSelectedIndex = null;
                var selectedIndex = this.getterSelectedIndex();
                this.setData({
                    visible: true,
                    selectedIndex: selectedIndex,
                });
                this.triggerPicker(true);
            }
        },
        triggerPicker: function (visible) {
            var onVisibleChange = this.props.onVisibleChange;
            if (onVisibleChange) {
                onVisibleChange(visible, fmtEvent(this.props));
            }
        },
        onMaskDismiss: function () {
            var onCancel = this.props.onCancel;
            this.setData({
                visible: false,
            });
            this.triggerPicker(false);
            if (onCancel) {
                return onCancel(fmtEvent(this.props, { detail: { type: 'mask' } }));
            }
        },
        onCancel: function () {
            var onCancel = this.props.onCancel;
            this.setData({
                visible: false,
            });
            this.triggerPicker(false);
            if (onCancel) {
                return onCancel(fmtEvent(this.props, { detail: { type: 'cancel' } }));
            }
        },
        onChange: function (e) {
            var onChange = this.props.onChange;
            var selectedIndex = e.detail.value;
            this.tempSelectedIndex = selectedIndex;
            this.isChangingPickerView = true;
            var _a = getMatchedItemByIndex(this.data.columns, this.tempSelectedIndex, this.single), matchedColumn = _a.matchedColumn, matchedValues = _a.matchedValues;
            this.setData({
                selectedIndex: selectedIndex,
            });
            if (onChange) {
                onChange.call(this, matchedValues, matchedColumn, fmtEvent(this.props, e));
            }
        },
        onOk: function () {
            return __awaiter(this, void 0, void 0, function () {
                var result, matchedColumn, matchedValues;
                return __generator(this, function (_a) {
                    if (this.tempSelectedIndex) {
                        result = getMatchedItemByIndex(this.data.columns, this.tempSelectedIndex, this.single);
                    }
                    else {
                        result = getMatchedItemByValue(this.data.columns, this.getValue(), this.single);
                    }
                    matchedColumn = result.matchedColumn, matchedValues = result.matchedValues;
                    this.setData({
                        visible: false,
                    });
                    this.triggerPicker(false);
                    if (!this.isControlled()) {
                        this.update(matchedValues);
                    }
                    if (this.props.onOk) {
                        this.props.onOk.call(this, matchedValues, matchedColumn, fmtEvent(this.props));
                    }
                    return [2 /*return*/];
                });
            });
        },
    },
});
